<template>
  <div>
    <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="用户管理" name="first">
        <repair-user />
      </el-tab-pane>
      <el-tab-pane label="维修数据" name="second">
        <repair-data
          @getRepairman="getRepairman"
          v-if="!repairman.repairmanId"
        />
        <repair-data-detail
          @clearRepairman="clearRepairman"
          v-else
          :repairman="repairman"
        />
      </el-tab-pane>
      <el-tab-pane label="维修人员评价" name="third">
        <repair-valuation />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import RepairUser from './repair-user.vue'
import RepairData from './repair-data.vue'
import RepairValuation from './repair-valuation.vue'
import RepairDataDetail from './repair-data-detail.vue'
export default {
  components: {
    RepairDataDetail,
    RepairValuation,
    RepairUser,
    RepairData
  },
  data() {
    return {
      activeName: 'first',
      repairman: {}
    }
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event)
    },
    getRepairman(res) {
      console.log('getRepairman:', res)
      this.repairman = res
    },
    clearRepairman() {
      this.repairman = {}
    }
  }
}
</script>

<style></style>
